<template>
  <div class="about">
    <span v-if="buttonTitle===''">你还没有点击按钮</span>
    <span v-else>你点击了"{{buttonTitle}}"按钮</span>
    <buttons v-on:button-event="handler"></buttons>
    <SoftMark version="v1.1"></SoftMark>
    <span>{{fullName}}</span>
  </div>
</template>

<script>
import SoftMark from "@/components/SoftMark.vue";
import Buttons from "@/components/Buttons.vue";
export default {
  data() {
    return {
      buttonTitle: "",
      firstName:'东方',
      lastName:'不败'
    };
  },
  components: {
    SoftMark,
    Buttons
  },
  methods: {
    handler(value) {
      this.buttonTitle = value;
    }
  },
  computed:{
    fullName(){
      return this.firstName+this.lastName;
    }
  }
};
</script>

<style lang="scss" scoped>
</style>
